<template>
	<view class="">
		<view class="c_input">
			<view class="title">昵称：</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写昵称" v-model="nickname" />
		</view>
		<view class="c_input">
			<view class="title">手机号</view>
			<input class="uni-input" focus placeholder="请填写手机号" v-model="phone" />
			<view class="c_btn" @tap="setTimer">
				{{getCodeText}}
			</view>
		</view>
		<view class="c_input">
			<view class="title">验证码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写验证码" v-model="code" />
		</view>
		<view class="c_input">
			<view class="title">密码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写最少8位密码" type="password" v-model="password" />
		</view>
		<view class="c_input">
			<view class="title">确认密码</view>
			<input class="uni-input" @confirm="goregist" placeholder="请填写确认密码" type="password" v-model="ispassword" />
		</view>
		<view class="c_input">
			<view class="title">推荐人ID</view>
			<input class="uni-input" disabled v-model="id" />
		</view>
		<view class="c_input">
			<view class="title">推荐人昵称</view>
			<input class="uni-input" disabled v-model="info.info.nickname" />
		</view>
		<view class="c_input">
			<view class="title">推荐人头像</view>
			<image :src="info.info.avatar" class="c_tx" mode=""></image>
		</view>
		<view class="r_buttons r_b_regist" @tap="goregist">立即注册</view>
		<!-- #ifdef H5 -->
		<view class="r_buttons" @tap="downloadapp">直接下载</view>
		<!-- #endif -->
		<view class="privacy">
			<!-- #ifdef APP-PLUS -->
			<checkbox-group style="display: inline-block;" @change="Yinchange">
				<checkbox value="true" />
			</checkbox-group>
			已阅读并同意
			<!-- #endif -->
			<!-- #ifdef H5 -->
			登录即同意
			<!-- #endif -->
			<text style="color: #4399fc;" @click="$navTo('https://bpapi.jinghushi.com/agreement.html')">“用户注册协议”</text>与<text
				style="color: #4399fc;" @click="$navTo('https://bpapi.jinghushi.com/policy.html')">“隐私政策”</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: "",
				nickname:'',
				phone: "",
				code: "",
				password: "",
				ispassword: "",
				info: {
					info: {}
				},
				getCodeText: "获取验证码",
				checkedYin: 0,
			}
		},
		onLoad(option) {
			var that = this;
			that.id = option.id;
			that.$axios('Checkagent/main', "POST", 'member', {
				mid: that.id
			}).then(res => {
				if (res.data.code == 200) {
					that.info = res.data.data
				}
			}, (error) => {

			})
		},
		methods: {
			downloadapp() {
				window.location.href = 'https://h5.bkyh.top/downapp/index.html';
			},
			setTimer() {
				var that = this;
				if (that.phone == '') {
					uni.showToast({
						title: "请输入手机号",
						icon: "none"
					})
					return false
				}
				if (this.getCodeText == "获取验证码") {
					this.$axios('sendcode/doSendcode', "POST", 'member', {
						mobile: that.phone
					}, this.$url.state.Edition).then(res => {
						if (res.data.code == 200) {
							let holdTime = 180;
							this.getCodeText = "180秒后获取"
							this.Timer = setInterval(() => {
								if (holdTime <= 0) {
									this.getCodeisWaiting = false;
									this.getCodeBtnColor = "#ffffff";
									this.getCodeText = "获取验证码"
									clearInterval(this.Timer);
									return;
								}
								holdTime--;
								this.getCodeText = "" + holdTime + "秒后获取"
							}, 1000)
						}
					}, (error) => {

					})
				}
			},
			Yinchange(e) {
				this.checkedYin = e.detail.value.length;
			},
			goregist() {
				// #ifdef APP-PLUS
				if (this.checkedYin !== 1) {
					this.$api.msg('请勾选用户协议与隐私政策');
					return;
				}
				// #endif
				var that = this;
				if(this.nickname==''){
					this.$api.msg('请填写昵称！');
					return ;
				}
				if (that.password !== that.ispassword) {
					uni.showToast({
						title: "两次密码输入不一致",
						icon: "none"
					})
					return false
				}
				if (that.password.length < 8) {
					uni.showToast({
						title: "请正确填写最少8位密码",
						icon: "none"
					})
					return false
				}
				that.$axios('Register/main', "POST", 'member', {
					referral: that.id,
					mobile: that.phone,
					password: that.password,
					code: that.code,
					nickname:this.nickname
				}).then(res => {
					if (res.data.code == 200) {
						uni.redirectTo({
							url: 'login'
						});
					}
				}, (error) => {

				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #f2f2f2;
		color: #303133;
		font-size: 28upx;
	}

	.c_input {
		display: flex;
		align-items: center;
		height: 40px;
		background: #fff;
		padding: 0 20upx;
		box-sizing: border-box;

		.title {
			width: 160upx;
		}

		input {
			height: 100%;
			margin-left: 20upx;
			font-size: 28upx;
			flex: 1;
		}

		.c_btn {
			padding: 10upx 20upx;
			background: #C0C4CC;
			font-size: 12px;
		}

		.c_tx {
			width: 50upx;
			height: 50upx;
			margin-left: 20upx;
		}
	}

	.r_buttons {
		border: 1px $base-color solid;
		border-radius: 20upx;
		color: $base-color;
		font-size: 30upx;
		margin: 30upx 0;
		line-height: 70upx;
		text-align: center;
	}

	.r_b_regist {
		background: $base-color;
		color: #fff;
	}

	.privacy {
		color: $font-color-base;
		padding-top: 16upx;
		font-size: 24upx;
		text-align: center;
	}
</style>
